.service-detail-container {
	--swiper-height: 458rpx;
	
	image {
		width: 100%;
		height: 100%;
	}
	
	padding-bottom: 250rpx;
}

.gap {
	margin: 24rpx 0;
	height: 2rpx;
	background-color: #F5F5F5;
}

.card-box {
	padding: 20rpx;
	background-color: #ffffff;
	border-radius: 20rpx;
}

.mt-20 {
	margin-top: 20rpx;
}

.service-detail-swiper {
	width: 100%;
	height: var(--swiper-height);
	position: relative;
}

.dots {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	// width: 100%;
	left: 50%;
	transform: translateX(-50%);
	bottom: 24rpx;
	z-index: 6;
	// pointer-events: none;

	.viewbox {
		width: 78rpx;
		height: 40rpx;
		background: #EEEEEE;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		font-weight: 400;
		font-size: 20rpx;
		color: #999999;
		line-height: 40rpx;
		text-align: center;

		&:last-child {
			margin-left: 30rpx;
		}

		&.select {
			// background: linear-gradient( 180deg, #FFA233 0%, #FB4C4C 100%);
			background-color: #E72A2A;
			color: #FFFFFF;
		}
	}
}

.service-detail-swiper-box {
	height: var(--swiper-height);
}

.service-detail-swiper-item {
	height: var(--swiper-height);
}

.service-detail-content {
	padding: 22rpx;
}

.service-goods-info-box {
	
}

.service-price-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.service-price {
	font-weight: 800;
	font-size: 56rpx;
	color: #E72A2A;
	display: flex;
	align-items: center;
	
	.pre {
		font-weight: 800;
		font-size: 30rpx;
		color: #E72A2A;
	}
	
	.sufix {
		font-weight: 400;
		font-size: 24rpx;
		color: #E72A2A;
	}
	
	.old-price {
		font-weight: 400;
		font-size: 28rpx;
		color: #999999;
		text-decoration: line-through;
		margin-left: 40rpx;
	}
}

.service-share {
	width: 48rpx;
	height: 48rpx;
}

.service-share-icon {
	width: 48rpx;
	height: 48rpx;
}

.service-goods-title {
	font-weight: 800;
	font-size: 36rpx;
	color: #333333;
	margin-top: 12rpx;
}

.service-goods-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 18rpx;
	margin-top: 16rpx;
}

.service-goods-tag {
	border-radius: 6rpx;
	padding: 4rpx 14rpx;
	font-weight: 400;
	font-size: 24rpx;
	box-sizing: border-box;
	border: 2rpx solid #0291FF;
	color: #0291FF;
}

.tag-primary {
	background: #FF6602;
	border-color: #FF6602;
	color: #FFF;
}

.service-goods-sale {
	font-weight: 400;
	font-size: 30rpx;
	color: #999999;
	margin-top: 24rpx;
}

.service-goods-select-wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.select-label {
	font-weight: bold;
	font-size: 30rpx;
	color: #333333;
}

.select-goods {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-left: 40rpx;
}

.select-goods-title {
	font-weight: 400;
	font-size: 30rpx;
	color: #333333;
}

.select-icon {
	width: 24rpx;
	height: 24rpx;
}

.service-goods-content-box {
	// display: inline-block;
}

.service-goods-content_H {
	white-space: nowrap;
	width: 100%;
}

.service-goods-content-item_H {
	display: inline-block;
	margin-right: 32rpx;
	width: max-content;
}

.service-goods-content-item {
	display: flex;
	align-items: center;
}

.service-goods-content-item-icon {
	width: 56rpx;
	height: 56rpx;
}

.service-goods-content-item-text {
	font-weight: 400;
	font-size: 30rpx;
	color: #333333;
	margin-left: 10rpx;
}

.comments-box {
	
}

.comments-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.comments-header-more-icon {
	width: 24rpx;
	height: 24rpx;
}

.comments-header-title {
	font-size: 36rpx;
	font-weight: bold;
	color: #333333;
}

.comments-count {
	font-weight: 400;
	font-size: 28rpx;
}

.comments-header-more {
	display: flex;
	align-items: center;
	font-weight: 400;
	font-size: 30rpx;
	color: #999999;
}

.comments-content_H {
	white-space: nowrap;
	width: 100%;
}

.comments-content-item_H {
	display: inline-block;
	margin-right: 20rpx;
	width: 606rpx;
	height: 432rpx;
	background: #F7F7F7;
	border-radius: 20rpx;
	padding: 20rpx;
}

.comments-content-item {
}

.comments-user {
	display: flex;
}

.comments-user-avatar {
	width: 90rpx;
	height: 90rpx;
	border-radius: 50%;
	overflow: hidden;
}

.comments-user-info-box {
	width: calc(100% - 100rpx);
	margin-left: 10rpx;
}

.comments-user-info {
	display: flex;
	justify-content: space-between;
}

.comments-user-info-left {
	display: flex;
	flex-wrap: wrap;
}

.comments-user-rate {
	// height: 26rpx;
	display: flex;
	align-items: center;
}

.comments-user-nickname {
	font-weight: bold;
	font-size: 28rpx;
	color: #333333;
}

.comments-time {
	font-weight: bold;
	font-size: 24rpx;
	color: #999999;
}

.comments-user-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10rpx;
}

.comments-user-tag {
	font-weight: 400;
	font-size: 24rpx;
	color: #E72A2A;
	border-radius: 6rpx;
	padding: 4rpx 14rpx;
	border: 2rpx solid #E72A2A;
}


.comments-textarea {
	font-weight: bold;
	font-size: 30rpx;
	color: #333333;
	height: 84rpx;
	overflow-wrap: break-word !important;
}

.comments-goods-images {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.comments-goods-image {
	width: 170rpx;
	height: 170rpx;
}

.text_ovf {
    text-align: justify;
    display: -webkit-box; /* 对于老版本的Webkit内核 */
    -webkit-line-clamp: 1; /* 限制在一个块元素显示的文本的行数 */
    -webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
    overflow: hidden; /* 隐藏超出的内容 */
    text-overflow: ellipsis; /* 用省略号显示被修剪的文本 */
}

// .s {
// 	position: sticky;
// }

.goods-detail-box {
	border-radius: 20rpx;
	overflow: hidden;
	background-color: #ffffff;
}

.goods-detail-content {
	width: 100%;
	// height: 772rpx;
}

.goods-detail-title {
	font-weight: bold;
	font-size: 36rpx;
	color: #333333;
}

.bottom-info-box {
	margin-top: 158rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.bottom-info-image {
	width: 132rpx;
	height: 36rpx;
	background: #FFFFFF;
	border-radius: 0rpx 0rpx 0rpx 0rpx;
	font-weight: 400;
	font-size: 20rpx;
	color: #333333;
	display: flex;
	align-items: center;
	justify-content: center;
}

.bottom-info-text {
	font-weight: 400;
	font-size: 24rpx;
	color: #999999;
	margin-top: 6rpx;
}

.fixed-btn {
	position: fixed;
	right: 36rpx;
	bottom: 300rpx;
	display: flex;
	align-items: center;
	flex-direction: column;
	
	.fixed-btn-image {
		width: 80rpx;
		height: 80rpx;
	}
	
	.fixed-btn-text {
		font-weight: 400;
		font-size: 22rpx;
		color: #333333;
		margin-top: 8rpx;
	}
}

.goods-bottom-nav {
	width: 100%;
	height: 134rpx;
	position: fixed;
	left: 0;
	bottom: 0;
	background: #FFFFFF;
	box-shadow: 0rpx -4rpx 8rpx 2rpx rgba(0,0,0,0.05);
	display: flex;
	align-items: center;
	padding: 22rpx;
	// padding-bottom: 52rpx;
	padding-bottom: calc(env(safe-area-inset-bottom) + 16rpx);
	padding-bottom: calc(constant(safe-area-inset-bottom) + 16rpx);
	box-sizing: content-box!important;
}

.goods-bottom-nav-left {
	flex: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-right: 74rpx;
	margin-left: 34rpx;
}

.goods-bottom-nav-left-item {
	display: flex;
	align-items: center;
	flex-direction: column;
}

.goods-bottom-nav-icon {
	width: 48rpx;
	height: 48rpx;
	image{
		width: 100%;
		height: 100%;
	}
}

.goods-bottom-nav-icon-text {
	font-weight: 400;
	font-size: 26rpx;
	color: #333333;
}

.goods-bottom-nav-right {
	margin-right: 28rpx;
}

.goods-bottom-nav-btn {
	width: 412rpx;
	height: 114rpx;
	// background: linear-gradient( 131deg, #FFA233 0%, #FB4C4C 100%);
	border-radius: 80rpx;
	font-weight: bold;
	font-size: 40rpx;
	color: #FFFFFF;
	text-align: center;
	line-height: 114rpx;
}

.header-nav {
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	padding: 24rpx 22rpx;
	background-color: transparent;
	z-index: 1;
	background-color: #FFFFFF;
	display: flex;
	justify-content: space-between;
}

.header-nav-item {
	font-weight: bold;
	font-size: 32rpx;
	color: #999999;
	
}

.header-nav-item-active {
	color: #333333;
	position: relative;
}

.header-nav-item-active-icon {
	width: 38rpx;
	height: 12rpx;
	
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -12rpx;
}

.one-btn {
	width: 100%;
	height: 96rpx;
	background: linear-gradient( 131deg, #FFA233 0%, #FB4C4C 100%);
	border-radius: 80rpx;
	text-align: center;
	line-height: 96rpx;
	font-weight: bold;
	font-size: 36rpx;
	color: #FFFFFF;
}